/**
 * Created by Administrator on 2017/4/6 0006.
 */
var React = require('react');


var Bheader = require('../widget/Bheader');
var Footer = require('../widget/Footer');
var ajax = require('../tools/ajax');
var postAjax = require('../tools/postAjax');
var IncreaseId = require('../../web/tools/IncreaseId');
var Icon = require('../components/Icon');
var MsgBox = require('../components/MsgBox');
var GT = require('../components/GT');

module.exports = React.createClass({
    getInitialState: function () {
        return {
            theme:"Default", //Default/Blue
            Id:this.props.params.id,
            addressInfo:localStorage.getItem("addressInfo"),
            uid:localStorage.getItem("userId"),
            realname: "",
            mobile:"",
            province: "",
            city:"",
            district:"",
            address:"",
            idcard:"",
            zipcode:"",
            btnFlag:false, //按键样式变化判断
            isdefault:0,//判断默认地址
            flag:true,//判断地址是否为默认 默认则无法修改
            isdefaultFlag:false//判断默认地址按钮是否被点击过
        }
    },

    componentDidMount: function () {
        this.edit();
        //所在城市选择器
        var area1 = new LArea();
        area1.init({
            'trigger': '#demo1', //触发选择控件的文本框，同时选择完毕后name属性输出到该位置
            'valueTo': '#value1', //选择完毕后id属性输出到该位置
            'keys': {
                id: 'value',
                name: 'text'
            }, //绑定数据源相关字段 id对应valueTo的value属性输出 name对应trigger的value属性输出
            'type': 2, //数据源类型
            'data': [provs_data, citys_data, dists_data]//数据源
        });
        // area1.value = ["330000","330100","330104"];//控制初始位置，注意：该方法并不会影响到input的value
    },
    //数据处理
    edit:function(){
        var addressInfo = JSON.parse(this.state.addressInfo);
        if(addressInfo[0]){
            for (var i = 0; i < addressInfo.length; i++) {
                if (addressInfo[i].id == this.state.Id) {
                    this.refs.realname.value = addressInfo[i].realname;
                    this.refs.mobile.value = addressInfo[i].mobile;
                    this.refs.idcard.value = addressInfo[i].idnumber;
                    this.refs.address.value = addressInfo[i].address;
                    this.refs.zipcode.value = addressInfo[i].zipcode;
                    this.setState({
                        province: addressInfo[i].province,
                        city: addressInfo[i].city,
                        district: addressInfo[i].district,
                        isdefault: addressInfo[i].isdefault
                    }, ()=> {
                        if (this.state.isdefault == 1) {
                            this.setState({flag: false});
                        }
                    });
                }
            }
        }else {
            this.setState({isdefault:1,flag:false});
        }
    },
    //号码及身份证判断正则
    CheckReg:function (UserMobile,UserIdcard) {
        let IdtelOne=/^1(3|4|5|7|8)\d{9}$/;//手机号码正则
        let IdCOne=/(^\d{15}$)|(^\d{17}([0-9]|X)$)/;//身份证正则
        if(IdtelOne.test(UserMobile)&&IdCOne.test(UserIdcard)){
           return true;
        }
    },
    //
    change:function () {
        var UserRealname = this.refs.realname.value;
        var UserMobile = this.refs.mobile.value;
        var UserIdcard = this.refs.idcard.value;
        var UserAddress =this.refs.address.value;
        var UserZipcode = this.refs.zipcode.value;
        var UserProvince = localStorage.getItem("province");
        var UserCity = localStorage.getItem("city");
        var UserDistrict = localStorage.getItem("county");
        var isdefaultFlag = this.state.isdefaultFlag;
        var Id = this.state.Id;
        console.log(UserRealname);
        this.setState({province: UserProvince, city: UserCity, district: UserDistrict});
        if(Id==0){
            if(UserRealname!=""&&UserMobile!=""&&UserIdcard!=""&&UserAddress!=""&&UserZipcode!=""&&this.CheckReg(UserMobile,UserIdcard)){
                this.setState({btnFlag:true});
            }else{
                this.setState({btnFlag:false});
            }
        }else{
            if(this.state.flag){
                if(UserRealname!=""&&UserMobile!=""&&UserIdcard!=""&&UserAddress!=""&&UserZipcode!=""&&isdefaultFlag&&this.CheckReg(UserMobile,UserIdcard)){
                    this.setState({btnFlag:true});
                }else{
                    this.setState({btnFlag:false});
                }
            }else{
                this.CheckReg(UserMobile,UserIdcard);
                if(UserRealname!=""&&UserMobile!=""&&UserIdcard!=""&&UserAddress!=""&&UserZipcode!=""&&this.CheckReg(UserMobile,UserIdcard)){
                    this.setState({btnFlag:true});
                }else{
                    this.setState({btnFlag:false});
                }
            }
        }
    },
    /**默认地址按钮判断*/
    isdefault(){
        var UserRealname = this.refs.realname.value;
        var UserMobile = this.refs.mobile.value;
        var UserIdcard = this.refs.idcard.value;
        var UserAddress =this.refs.address.value;
        var UserZipcode = this.refs.zipcode.value;
        if(this.state.flag){
            if(this.state.isdefault == 0){
                this.setState({isdefault:1});
            }else{
                this.setState({isdefault:0});
            }
            this.CheckReg(UserMobile,UserIdcard);
            if(UserRealname!=""&&UserMobile!=""&&UserIdcard!=""&&UserAddress!=""&&UserZipcode!=""&&this.CheckReg(UserMobile,UserIdcard)){
                this.setState({btnFlag:true});
            }else {
                this.setState({btnFlag: false});
            }
            this.setState({isdefaultFlag:true});
        }else{
            this.refs.MsgBox.setState({
                type: "no",
                timeout:750,
                show:true,
                word:"默认地址不能修改"
            })
        }
    },
    //修改地址
    changeAddress:function(){
        var id = this.state.Id;
        var uid = this.state.uid;
        var realname = this.refs.realname.value;
        var mobile = this.refs.mobile.value;
        var province = localStorage.getItem("province");
        var city = localStorage.getItem("city");
        var district = localStorage.getItem("county");
        var idnumber = this.refs.idcard.value;
        var address = this.refs.address.value;
        var zipcode = this.refs.zipcode.value;
        var isdefault = this.state.isdefault;
        if (uid){
            ajax("POST","changeAddress",{
                id:id,//地址ID
                uid:uid,//uid
                realname:realname,//姓名realname
                mobile:mobile,//手机号
                province:province,//省
                city:city,//市
                district:district,//区/镇
                idnumber:idnumber,//身份证
                address:address,//详细地址
                zipcode:zipcode,//邮政
                isdefault:isdefault//是否为默认
            },function (dt) {
                if(dt&&dt.success){
                    location.href = "#addressInfo";
                }
            });
        }
    },

    render: function () {
        var p = this;
        console.log(p.state.btnFlag);
        return (
            <div className="main"  id="main">
                <Bheader Id={p.state.Id} theme={p.state.theme} title={p.state.Id != "0"? "修改地址":"新建收货地址"} headr="flase" hact="#addressInfo"  wordBtn={this.state.Id != "0"? "删除":""}></Bheader>
                <div className="container-t">
                    <hr className="orderHr" />
                    <ul className="editAddress">
                        <li>
                            <span>收货人</span>
                            <input onChange={p.change} ref="realname" type="text" placeholder="收货人姓名" onfocus="this.placeholder=''" onblur="this.placeholder='姓名'" />
                        </li>
                        <li>
                            <span>手机号码</span>
                            <input onChange={p.change} ref="mobile" type="number" maxLength="11" placeholder="手机号码" onfocus="this.placeholder=''" id="qw"/>
                        </li>
                        <li>
                            <span>收货人身份证号</span>
                            <input onChange={p.change} ref="idcard" type="text" maxLength="18" placeholder="收货人身份证号" onfocus="this.placeholder=''" />
                        </li>
                        <li>
                            <span>邮政编号</span>
                            <input onChange={p.change} ref="zipcode" type="text" maxLength="6" placeholder="邮政编号" onfocus="this.placeholder=''" onblur="this.placeholder='邮政编号'"/>
                        </li>
                        <li>
                            <span>所在城市</span>
                            <input onChange={p.change} id="demo1" type="text"  readOnly="true" placeholder="请选择所在城市" onblur={p.blur} value= {p.state.province + p.state.city + p.state.district} />
                            <input id="value1" type="hidden" value="12,124,3266"/>
                            <GT></GT>
                        </li>
                        <li>
                            <span>详细地址</span>
                            <input onChange={p.change} ref="address" type="text" placeholder="请填写详细地址" onfocus="this.placeholder=''" onblur="this.placeholder='请填写详细地址'" />
                        </li>
                        <li onClick={p.isdefault}>
                            <span>设置为默认地址</span>
                            <div className={p.state.isdefault == 1 ?"isdefault clicked":"isdefault"}>
                                <Icon icon="#icon-xuanzhong1"/>
                            </div>
                        </li>
                    </ul>
                    <div className={p.state.btnFlag?"editAddressBtn clicked":"editAddressBtn"} onClick={p.state.btnFlag?p.changeAddress:""}>
                        {p.state.Id != "0" ? "保存":"新建"}
                    </div>
                </div>
                <MsgBox ref="MsgBox"></MsgBox>
            </div>
        )
    }
});

